<template>
	<view class="page">
		<div
			style="border-bottom: 5px solid #f3f4f5; background: #fff;position: fixed;top:0;z-index: 100;width: 100%; ">
			<div class="mySearch" style="padding-bottom: 10px;">
				<u-search placeholder="请输入" v-model="form.code" :showAction='false' @change='search'>
				</u-search>
			</div>
		</div>
		<div style="margin-top: 60px;">
			<div class="myUnit" v-for="(item, index) in list">
				<div @click='goNext(item.id)'>
						<div class="unitTitle">
							<div>
								{{index+1}}.{{item.orderNo}}
							</div>
							<u-icon name="arrow-right"></u-icon>
						</div>
					<div class="myText">
						<div>订单状态：</div>
						<div>{{item.orderStatusDesc}}</div>
					</div>
					<div class="myText">
						<div>关联单号：</div>
						<div>{{item.reOrderNo||'-'}}</div>
					</div>
					<div class="myText">
						<div>商品名称：</div>
						<div>{{item.productName}}</div>
					</div>
					<div class="myText">
						<div>订单数量：</div>
						<div>{{item.quantity}}</div>
					</div>
					<div class="myText">
						<div>创建时间：</div>
						<div>{{item.createTime||'-'}}</div>
					</div>
				</div>
			</div>
			<u-loadmore class='myLoadmore' :status="status" line />
		</div>
	</view>
</template>

<script>
	import {
		listOrder,changeOrder,startOrder
	} from "@/api/orderMng/index.js"
	export default {
		data() {
			return {
				status: 'loading',
				flag:0, //0待处理，1已出来
				list: [],
				scanForm:{
					flag:0
				},
				form: {
					code: null,
					pageNum: 1,
					pageSize: 10,
					orderStatusList:[30,40,50]
				}
			}
		},
		onReachBottom() {
			this.loadmore();
		},
		onLoad(e) {
			this.getList()
		},
		methods: {
			search() {
				this.form.pageNum = 1
				this.getList()
			},
			loadmore() {
				this.form.pageNum++;
				this.getList();
			},
			goNext(id) {
				uni.navigateTo({
					url: '/pages/orderMng/orderDetail?id=' + id
				})
			},
			getList() {
				listOrder(this.form).then(res => {
					let total = res.total
					let list = res.rows
					if (this.form.pageNum == 1) {
						uni.pageScrollTo({
							scrollTop: 0
						})
						this.list = list;
					} else {
						this.list = this.list.concat(list);
					}
					if (this.form.pageNum * 10 >= total) {
						this.status = 'nomore'
					} else {
						this.status = 'loadmore'
					}
				}).catch(e => {
					this.status = 'nomore'
				})
			}
		}
	}
</script>
<style scoped lang="scss">
	.aBtn{
		color:$u-primary;
	}
	.btns {
		display: flex;
		justify-content: space-around;
		margin-top: 10px;
	}

	.btn {
		padding: 0 10px;
		border: 1px solid;
		text-align: center;
		border-radius: 10px;
	}

	.btn1 {
		color: #0275a1;
		border: 1px solid #0275a1;
		background: #0275a11f;
	}

	.btn2 {
		color: #009688;
		border: 1px solid #009688;
		background: #00968842;
	}


	.statusTag {
		font-size: 14px;
		color: #fff;
		border-radius: 10px;
		padding: 0 5px;
		margin: 10px;
		font-weight: normal;
		position: absolute;
		right: 10px;
		top: -10px;
		background: #909399;
	}

	.primaryTag {
		background: $u-primary;
	}
</style>